<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册页面</title>
    <link rel="stylesheet" href="../../public/css/other/register.css">
    <link rel="stylesheet" href="../../public/css/other/clearOutline.css">
</head>
<body>
<div class="pc">
    <aside>
        <img src="./../../public/resources/logo.png">
        <p>成为更好的自己</p>
    </aside>
    <main class="pc-main">
        <div class="pc-line">
            <p>用户名</p>
            <input placeholder="请输入用户名..." type="text" class="userName">
        </div>
        <div class="pc-line pc-emailLine">
            <p>邮箱</p>
            <input placeholder="请输入邮箱..." type="email" class="email">
            <button class="getVerificationCode pc-getVerificationCode">获取验证码</button>
        </div>
        <div class="pc-line">
            <p>验证码</p>
            <input placeholder="请输入验证码..." type="text" class="verCode">
        </div>
        <div class="pc-line">
            <p>密码</p>
            <input placeholder="至少为6位的数字与字母组合..." type="password" class="password" oninput="watchPsw()">
            <div class="pc-passwordStrength">
                <div class="weakLevel"></div>
                <div class="middleLevel"></div>
                <div class="strongLevel"></div>
            </div>
        </div>
        <div class="pc-line">
            <p>确认密码</p>
            <input placeholder="再次确认密码..." type="password" class="againPassword">
        </div>
        <a class="pc-a" href="pswLogin.html">已注册？去登录</a>
        <button class="pc-button registerBtn">
            注册
        </button>
    </main>
</div>
<div class="mobile">
    <header id="registerHeader">
        <p id="registerTitle">注册</p>
    </header>
    <main class="mobile-main">
        <div class="mobile-line">
            <p>用户名</p>
            <input placeholder="请输入用户名..." type="text" class="userName">
        </div>
        <div class="mobile-line mobile-emailLine">
            <p>邮箱</p>
            <input placeholder="请输入邮箱..." type="email" class="email">
            <button class="getVerificationCode">获取验证码</button>
        </div>
        <div class="mobile-line">
            <p>验证码</p>
            <input placeholder="请输入验证码..." type="text" class="verCode">
        </div>
        <div class="mobile-line">
            <p>密码</p>
            <input placeholder="至少为6位的数字与字母组合..." type="password" class="password" oninput="watchPsw()">
            <div class="mobile-passwordStrength">
                <div class="weakLevel"></div>
                <div class="middleLevel"></div>
                <div class="strongLevel"></div>
            </div>
        </div>
        <div class="mobile-line">
            <p>确认密码</p>
            <input placeholder="再次确认密码..." type="password" class="againPassword">
        </div>
        <a href="pswLogin.html">已注册?去登录</a>
    </main>
    <footer>
        <button class="registerBtn">
            注册
        </button>
    </footer>
</div>
<script src="../../public/js/other/register.js"></script>
<script src="../../public/js/api.js"></script>
<script src="../../public/js/ajax.js"></script>
</body>
</html>